<template>
    <div class="app-container">
        <div class="search-container">
            <el-form :model="queryParams" ref="queryParamsRef" :inline="true" label-width="100px">
                <el-form-item label="门诊/住院">
                    <el-radio-group v-model="queryParams.inoroutFlag" @change="inoroutFlagChange">
                        <el-radio-button value="4">门诊</el-radio-button>
                        <el-radio-button value="1">住院</el-radio-button>
                    </el-radio-group>
                </el-form-item>
                <el-form-item :label="queryParams.inoroutFlag === '4' ? '门诊号' : '住院号'" prop="clinicNo">
                    <el-input v-model="queryParams.patientNo" placeholder="请输入门诊号" clearable
                              @keyup.enter="handleQuery"/>
                </el-form-item>
                <el-form-item label="姓名" prop="name">
                    <el-input v-model="queryParams.name" clearable placeholder="请输入姓名" @keyup.enter="handleQuery"/>
                </el-form-item>
                <!-- <el-form-item label="联系电话" prop="phone">
                    <el-input v-model="queryParams.phone" placeholder="请输入联系电话" clearable @keyup.enter="handleQuery" />
                </el-form-item> -->
                <el-form-item label="申请单号" prop="clinicNo">
                    <el-input v-model="queryParams.applyNo" placeholder="请输入申请单号" clearable
                              @keyup.enter="handleQuery"/>
                </el-form-item>
                <el-form-item label="确认状态">
                    <el-radio-group v-model="queryParams.confirmFlag" @change="confirmFlagHandleQuery">
                        <el-radio-button value="1">未确认</el-radio-button>
                        <el-radio-button value="2">已确认</el-radio-button>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="收费状态">
                    <el-radio-group v-model="queryParams.chargeFlag" @change="handleQuery">
                        <el-radio-button value="1">未收费</el-radio-button>
                        <el-radio-button value="2">已收费</el-radio-button>
                        <el-radio-button value="3">申请退费</el-radio-button>
                        <el-radio-button value="4">已退费</el-radio-button>
                        <el-radio-button value="6">科室确认退费</el-radio-button>
                    </el-radio-group>
                </el-form-item>
                <div class="mr20 mb10 ml20">
                    <query-form-button @handleQuery="handleQuery" @resetQuery="resetQuery"/>
                </div>
            </el-form>
        </div>
        <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
                <el-button v-if="(queryParams.inoroutFlag === '4' && queryParams.confirmFlag === '1' && queryParams.chargeFlag === '2')
                    || (queryParams.inoroutFlag === '1'  && queryParams.confirmFlag === '1' && queryParams.chargeFlag === '1')"
                           plain type="primary" @click="confirmOkFun('2')"
                           :disabled="ids.length <= 0">
                    <svg-icon icon-class="grant-info"/>
                    确认
                </el-button>
                <el-button
                    v-if="queryParams.confirmFlag === '2' && (queryParams.chargeFlag === '2' || queryParams.chargeFlag === '6')"
                    :disabled="ids.length <= 0" plain
                    type="info"
                    @click="confirmOkFun('1')">
                    <svg-icon icon-class="grant-info"/>
                    取消确认
                </el-button>
            </el-col>
        </el-row>

        <el-table v-adaptive :border="true" :data="businessList" :header-cell-style="$headerCellStyle" :stripe="true"
                  highlight-current-row @selection-change="handleSelectionChange">
            <el-table-column :align="'center'" type="selection" width="45"/>
            <el-table-column v-if="queryParams.inoroutFlag === '4'" :align="'center'" label="就诊日期" prop="visitDate" width="100">
                <template #default="scope">
                    <span>{{ $parseTime(scope.row.visitDate, '{y}-{m}-{d}') }}</span>
                </template>
            </el-table-column>
            <el-table-column label="是否加急" :align="'center'" prop="isUrgent" width="70">
                <template #default="scope">
                    <dict-data-tag :options="dictDataMap['sys_yes_no']" :value="scope.row.isUrgent"/>
                </template>
            </el-table-column>
            <el-table-column :align="'center'" :label="queryParams.inoroutFlag === '4' ? '门诊号' : '住院号'"
                             prop="clinicNo"
                             width="100">
                <template #default="scope">
                    <span v-if="queryParams.inoroutFlag === '4'">{{scope.row.clinicNo}}</span>
                    <span v-if="queryParams.inoroutFlag === '1'">{{scope.row.hospitalNo}}</span>
                </template>
            </el-table-column>
            <el-table-column :align="'center'" label="姓名" prop="name" width="110"/>
            <el-table-column label="性别" :align="'center'" prop="sex" width="50">
                <template #default="scope">
                    <dict-data-tag :options="dictDataMap['sys_user_sex']" :value="scope.row.sex"/>
                </template>
            </el-table-column>
            <el-table-column label="年龄" :align="'center'" prop="age" width="110" :show-overflow-tooltip="true">
                <template #default="scope">
                    {{ scope.row.age }} 岁
                    {{ scope.row.ageMonth }} 月
                    {{ scope.row.ageDay }} 天
                </template>
            </el-table-column>
            <el-table-column :align="'center'" :show-overflow-tooltip="true" label="联系电话" prop="phone" width="100"/>
            <el-table-column label="出生日期" :align="'center'" prop="birthdayDate" width="90">
                <template #default="scope">
                    <span>{{ $parseTime(scope.row.birthdayDate, '{y}-{m}-{d}') }}</span>
                </template>
            </el-table-column>
            <el-table-column :align="'center'" :show-overflow-tooltip="true" label="住址" prop="address" width="120"/>
            <el-table-column label="申请单号" :align="'center'" prop="applyNo" width="130">
                <template #default="scope">
                    <span class="ys-css">{{ scope.row.applyNo }}</span>
                </template>
            </el-table-column>
            <el-table-column label="收费标志" width="120" :align="'center'" prop="chargeFlag" fixed="left">
                <template #default="scope">
                    <dict-data-tag :options="dictDataMap['charge_flag_dict']" :value="scope.row.chargeFlag"/>
                </template>
            </el-table-column>
            <el-table-column label="确认标志" width="80" :align="'center'" prop="confirmFlag" fixed="left">
                <template #default="scope">
                    <dict-data-tag :options="dictDataMap['confirm_flag']" :value="scope.row.confirmFlag"/>
                </template>
            </el-table-column>
            <el-table-column :align="'center'" label="开单科室" prop="applyDeptName" width="90"/>
            <el-table-column :align="'center'" label="执行科室" prop="implementDeptName" width="90"/>
            <el-table-column label="项目明细" :align="'center'" prop="" width="70">
                <template #default="props">
                    <el-popover placement="right" title="明细" :width="640" trigger="hover">
                        <template #reference>
                            <el-button type="primary">详情</el-button>
                        </template>
                        <el-table :data="props.row.labItemVoList" :stripe="true" highlight-current-row>
                            <el-table-column fixed="left" label="项目代码" prop="itemCode" width="80px"/>
                            <el-table-column fixed="left" label="项目名称" prop="itemName" width="140px"/>
                            <el-table-column :align="'center'" fixed="left" label="收费标志" prop="chargeFlag"
                                             width="120">
                                <template #default="scope">
                                    <dict-data-tag :options="dictDataMap['charge_flag_dict']"
                                                   :value="scope.row.chargeFlag"/>
                                </template>
                            </el-table-column>
                            <el-table-column fixed="left" label="数量" prop="num" width="80px"/>
                            <el-table-column fixed="left" label="单价(元)" prop="price" width="100px"/>
                            <el-table-column fixed="left" label="总价(元)" prop="costs" width="100px"/>
                        </el-table>
                    </el-popover>
                </template>
            </el-table-column>
            <el-table-column :align="'center'" :show-overflow-tooltip="true" label="症状" prop="symptom" width="100"/>
            <el-table-column :align="'center'" :show-overflow-tooltip="true" label="体征" prop="sign" width="100"/>
            <el-table-column label="临床诊断" :align="'center'" prop="clinicalDiag" width="105"
                             :show-overflow-tooltip="true"/>
            <el-table-column label="开单时间" :align="'center'" prop="realDate" width="140">
                <template #default="scope">
                    <span>{{ $parseTime(scope.row.realDate, "{y}-{m}-{d} {h}:{i}:{s}") }}</span>
                </template>
            </el-table-column>
            <el-table-column :align="'center'" label="确认人" prop="confirmUserName" width="90"/>
            <!-- <el-table-column label="取消确认" :align="'center'" prop="cancelConfirmUser" /> -->
            <el-table-column label="确认时间" :align="'center'" prop="confirmDate" width="140">
                <template #default="scope">
                    <span>{{ $parseTime(scope.row.confirmDate, "{y}-{m}-{d} {h}:{i}:{s}") }}</span>
                </template>
            </el-table-column>
        </el-table>

        <pagination v-show="total > 0" v-model:limit="queryParams.pageSize" v-model:page="queryParams.pageNum"
                    :total="total" @pagination="getList"/>
    </div>
</template>

<script lang="ts" setup>
import {labConfirmOk, selectPageLabApply} from "@/api/patient/labApply";

import {useUserStoreHook} from "@/store/modules/user";
import {useDictStoreHook} from "@/store/modules/dict";

const useUserStore = useUserStoreHook();
const {proxy} = getCurrentInstance() as any
const dictStore = useDictStoreHook();
let dictDataMap = ref(dictStore.isTypeGetData("clinic_or_visit", "charge_flag_dict", "sys_yes_no", "sys_user_sex", "confirm_flag"))
// 登录用户信息
const userInfo = <UserInfoBusi>useUserStore.user.userInfo
const currentSelectDept = proxy.$currentSelectDept

// 选中数组
const ids = ref([])

// 总条数
const total = ref(0)
const queryParamsRef = ref()
const businessList = ref<any>([])
const queryParams = ref<any>({
    pageNum: 1,
    pageSize: 10,
    visitDate: "",
    clinicNo: "",
    idNo: "",
    orgId: userInfo.orgId,
    inoroutFlag: "4",
    chargeFlag: "2",
    confirmFlag: "1",
    implementDept: currentSelectDept
})

// 多选框选中数据
function handleSelectionChange(selection) {
    ids.value = selection.map(item => item.id);
}


function getList() {
    if (queryParams.value.inoroutFlag === "4") {
        queryParams.value.clinicNo = queryParams.value.patientNo;
    } else {
        queryParams.value.hospitalNo = queryParams.value.patientNo;
    }
    selectPageLabApply(queryParams.value).then((response: any) => {
        businessList.value = response.rows;
        total.value = response.total;
    });
}


function confirmFlagHandleQuery() {
    if (queryParams.value.confirmFlag === "2") {
        queryParams.value.chargeFlag = "2"
    }
    handleQuery()
}

/**
 * 收费状态选择事件
 */
function inoroutFlagChange() {
    if (queryParams.value.inoroutFlag === "1") {
        // 住院
        queryParams.value.chargeFlag = "1";
    } else {
        queryParams.value.chargeFlag = "2";
    }
    handleQuery()
}

/** 搜索按钮操作 */
function handleQuery() {
    queryParams.value.pageNum = 1;
    getList();
}


/** 重置按钮操作 */
function resetQuery() {
    queryParamsRef.value.resetFields()
}

function confirmOkFun(type: string) {
    ElMessageBox.confirm("确定要操作吗？", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
    }).then(() => {
        labConfirmOk({
            ids: ids.value,
            confirmFlag: type,
            orgId: queryParams.value.orgId,
            inoroutFlag: queryParams.value.inoroutFlag
        }).then((res: resType) => {
            if (res.code === 200) {
                ElMessage.success(type === '2' ? "确认成功" : "取消确认成功");
                getList()
            }
        })
    })
}

if (queryParams.value.implementDept) {
    getList()
}
</script>

<script lang="ts">
export default {
    name: "LabConfirm"
}
</script>
<style scoped></style>
